<!DOCTYPE html>
<html>
	<meta name="viewport" content="width=device-width,initial-scale=1.0">
	<head>
		<meta charset="UTF-8">
		<title>支付方式</title>
		<link rel="stylesheet" type="text/css" href="css/rest.css"/>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
		<style>
			.table06{
				float: left;
				width: 80%;				
				background:#fff;
				padding-bottom: 300px;
				border-collapse:collapse;

			}
			.table06 tr{
				width: 50%;
				height: 60px;
				border-bottom:1px solid #ddd;
				line-height: 50px;
			}
			.table06 .tr02{
				border-bottom: none;
			}
			.table06 .tr04{
				border-bottom: none;
			}
			
			.table06 tr span{
				color:orange;
				font-size: 16px;
			}
			.td001{
				text-align: right;
				padding-right: 10px;
			}
			
			input{
				border:none;				
				background:none;
				padding:5px 10px;
				background: #FAFFBD;
				border: 1px solid #eee;
				padding-left: 5px;
			}
			.td004{
				padding-left: 30px;
				
			}
			.td002{
				text-align: center;
			}
			
			.btn02{
				background:none;
				border:0;
				padding:10px 30px;
				background: #2A82DB;
				border-radius: 5px;
				color:#fff;
			}
			.tr03{
				display: none;
			}
			</style>
	</head>
	<body>
		<table border="0" cellspacing="" cellpadding="" class="table06">
			
			<tr>
				<td width="5%" class="td001"><input type="radio" name="zhifu" checked="checked"/></td>
				<td width="20%" class="td002"><img src="https://cashier.dttx.com/app/cashier/template/cn/pc/submit/Alipay.png" width="15px" class="mlr15 vbottom" style="vertical-align: middle;">&nbsp;&nbsp;请使用支付宝支付</td>			
				<td class="td004">支付 <span>0.00</span>元</td>
			</tr>
			<tr>
				<td width="5%"  class="td001"><input type="radio" name="zhifu" /></td>
				<td width="20%" class="td002"><img src="images/weixing.jpg" width="30px" height="mlr15 vbottom" style="vertical-align: middle;">&nbsp;&nbsp;请微信支付</td>			
				<td class="td004">支付 <span>0.00</span>元</td>
			</tr>
			<tr class="tr02">
				<td width="5%" class="td001"><input type="radio" name="zhifu" id="xuanz"/></td>
				<td width="20%" class="td002"><img src="https://cashier.dttx.com/app/cashier/template/cn/pc/submit/Unionpay.png" width="15px" class="mlr15 vbottom" style="vertical-align: middle;">&nbsp;&nbsp;账户余额</td>		
				<td class="td004">支付 <span>0.00</span>元</td>
				
			</tr>
			<tr class="tr03">
				<td></td>
				<td>
					安全密码&nbsp;&nbsp;&nbsp;<input type="password" />
				</td>
				<td></td>
			</tr>
			<tr class="tr04">
				<td></td>
				<td width="20%" class="td002">
					<button type="button" class="btn02">确认支付</button>
				</td>
				<td></td>
			</tr>
			
		</table>
		<script src="js/jquery-1.11.3.min.js"></script>
		<script>


					$(function(){
						$('.table06 tr td.td001 input ').click(function(){
							if($('#xuanz').prop('checked')) {
								$(".tr03").show();
			                } else {	                
			              	   $(".tr03").hide();
			                }
						})
					})

				

		</script>
	</body>
</html>
  
